<!--
*@Author: QWP
*@Description: 聊天框头部
*@Date: 2024-07-11 14:55:49
-->
<template>
  <a-layout-header style="height: 60px; line-height: 60px; padding-inline: 20px; background-color: #1890FF;">
    <a-row align="middle" justify="space-between">
      <span style="font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 18px;
        color: #FFFFFF;" >{{ data.groupNames  }}</span>

        <a-space size="middle">
          <EllipsisOutlined style="color: #FFFFFF; font-size: 22px; cursor: pointer;"
            v-if="showMore"
            @click="emits('more')"/>
          <CloseOutlined style="color: #FFFFFF; font-size: 20px; cursor: pointer;"
            v-if="isDialog"
            @click="emits('close')"/>
        </a-space>
    </a-row>
  </a-layout-header>
</template>

<script lang='ts' setup>
import { ref, reactive, computed, onMounted } from 'vue' 

import { useRoute, useRouter } from 'vue-router'

interface Props {
  data?: any,
  showMore?: boolean,
  isDialog?: boolean
}
withDefaults(defineProps<Props>(), {
  isDialog: false,
  showMore: true,
  data: {
    name: ''
  }
})

const emits = defineEmits(['more', 'close'])

</script>

<style lang='scss' scoped>
</style>